import React from 'react'
import Component, { mapStateToProps, mapDispatchToProps } from '@components/Component'
import { connect } from 'react-redux'
import { Table, message } from 'antd'
import style from '@pages/filingCaseManage/CaseManage.module.less'
import nStyle from './Index.module.less'
import EditModal from './EditModal'
import { getColumns } from './util'
import InstitutionDetailModal from './InstitutionDetailModal'
import DetailModal from './DetailModal'

class SecretaryStatistic extends Component {
  state = {
    dictionaries: {},
    causeActions: [],
    list: [],
    loading: false,
    orderField: '',
    order: '',
    visible: false,
    modifyData: null,
    detailVisible: false,
    auditDetailVisible: false
  }

  formRef = React.createRef()

  // 格式化枚举字典
  formatDictionaries (dictionaries = []) {
    const result = {}
    dictionaries.forEach(d => {
      result[d.type] = d.list
    })
    return result
  }

  // 获取表格数据
  getTableData (form) {
    this.setState({ loading: true })
    this.$get('/api/mgt/institution/auditList', {
      institutionid: this.props.meta.id
    })
      .then(res => {
        this.setState({ loading: false })
        if (res.status !== 1) {
          return message.warning(res.message)
        }
        this.setState({
          list: res.data.map((li, i) => {
            li.key = i + 1
            return li
          })
        })
      }).catch(() => this.setState({ loading: false }))
  }

  // 表格请求变化
  tableChange (pagination, filters, sorter) {
    this.setState({
      orderField: sorter.field,
      order: sorter.order
    }, () => {
      this.getTableData()
    })
  }

  componentDidMount () {
    this.getTableData()
  }

  render () {
    return (
      <div className={style.container}>
        <div className={style['title-line']}>
          <span>{this.props.title}</span>
        </div>
        <div className={style['table-container']}>
          <Table loading={this.state.loading} className={nStyle['detail-table']} columns={getColumns.call(this)} dataSource={this.state.list} pagination={false} onChange={(...args) => this.tableChange(...args)} />
        </div>
        <EditModal visible={this.state.visible} id={this.props.meta.id} data={this.state.modifyData} hide={() => this.setState({ visible: false })} refreshFn={() => { this.getTableData() }} />
        <DetailModal visible={this.state.auditDetailVisible} id={this.props.meta.id} data={this.state.modifyData} hide={() => this.setState({ auditDetailVisible: false })} />
        <InstitutionDetailModal visible={this.state.detailVisible} data={this.state.modifyData} hide={() => this.setState({ detailVisible: false })} />
      </div>
    )
  }
}

const mapState = mapStateToProps(function (state) {
  return {

  }
})

const mapDispatch = mapDispatchToProps(function (dispatch) {
  return {

  }
})

export default connect(mapState, mapDispatch)(SecretaryStatistic)
